<template>
    <div>
        <h3>美食信息</h3>
        <table>
            <tr>
                <th>菜品图片</th>
                <th>菜品名称</th>
                <th>菜品配料</th>
            </tr>
            <tr v-for="(item,i) in cate_list" :key="i">
                <td>
                    <img :src="item.img" alt="" style="width:100px">
                </td>
                <td>{{item.title}}</td>
                <td>{{item.main_food}}</td>
            </tr>
        </table>
    </div>
</template>

<script>
import Axios from 'axios'
export default {
    name: '',
    data() {
        return {
            cate_list:[],
        };
    },
    props: {},

    components: {},

    created() {},

    mounted() {
        Axios.get("http://127.0.0.1:8000/cate/list/")
        .then(res=>{
            console.log("菜品信息>>>", res)
            this.cate_list = res.data
        })
    },

    methods: {},

    computed: {},

    watch: {},

    directives: {},

    filters: {}
};
</script>

<style>
* {
    margin: 0;
}
</style>
